<!DOCTYPE html>
<html>
  <head>
		<title>保洁人员接单</title>
		<meta charset="UTF-8">
		<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"> 
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">    
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<!-- 插件样式 -->
    <link rel="stylesheet" href="./service/css/style.css">
		<link href="../jsp/css/acceptOrder.css" rel="stylesheet">

		<!-- 插件js -->
		<script type="text/javascript" src="../js/jquery-2.1.1.js"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="./js/zepto.js"></script>
		<script src="./js/sm.js"></script>
		<script src="./js/sm-extend.js"></script>
		<script src="../js/common.js"></script>
		<script src="./js/acceptOrder.js" type="text/javascript"></script>
  </head>
  <script type="text/javascript">
  window.$$=window.Zepto = Zepto;
  </script>
  <body style="background: #fff;">
		<div class="accept-content">
			<!-- 第一步 -->
			<div class="accept-step" id="step_01">
				<div class="content">
					<dl>
						<dt>客户姓名：</dt>
						<dd>陈女士</dd>
					</dl>

					<dl>
						<dt>电话号码：</dt>
						<dd>13800000000</dd>
					</dl>

					<dl>
						<dt>地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址：</dt>
						<dd>珠海市香洲区翠湖香山5栋3202</dd>
					</dl>
					
					<dl>
						<dt>预约时间：</dt>
						<dd>6月25日  15:00 --17:00</dd>
					</dl>

					<dl>
						<dt>预约时长：</dt>
						<dd>2小时</dd>
					</dl>

					<dl>
						<dt>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注：</dt>
						<dd>客户要求重点清洁厨房，请携带除油烟工具，厨房用时适当加长。</dd>
					</dl>

					<div class="order-tips">注意：请准时到达指定地点，开始保洁前请点击下面按钮以确认开始。</div>
				</div>
				<div class="bottom-btn" id="begin-btn"><span>开始保洁</span></div>
			</div>

			<!-- 第二步 -->
			<div class="accept-step" id="step_02">
				<div class="content content2">
					<h2 class="title">已开始保洁！</h2>
					<dl>
						<dt>保洁订单：</dt>
						<dd>翠湖香山5栋3202</dd>
					</dl>

					<dl>
						<dt>预约时长：</dt>
						<dd>2小时</dd>
					</dl>
					
					<dl>
						<dt>预约时间：</dt>
						<dd>15:00 --17:00</dd>
					</dl>
					
					<dl>
						<dt>预约计时：</dt>
						<dd>00:00:25</dd>
					</dl>

					<div class="order-tips">注意：保洁完成后请及时点击下面完成保洁按钮。</div>
				</div>
				<div class="bottom-btn" id="finish-btn"><span>完成保洁</span></div>
			</div>

			<!-- 第三步 -->
			<div class="accept-step" id="step_03">
					<div class="content content2">
						<h2 class="title">已完成保洁！</h2>
						<dl>
							<dt>保洁订单：</dt>
							<dd>翠湖香山5栋3202</dd>
						</dl>
	
						<dl>
							<dt>预约时长：</dt>
							<dd>2小时</dd>
						</dl>
						
						<dl>
							<dt>预约时间：</dt>
							<dd>15:00 --17:00</dd>
						</dl>
						
						<dl>
							<dt>保洁时间：</dt>
							<dd>15:00 --17:00</dd>
						</dl>
						
						<dl>
							<dt>保洁用时：</dt>
							<dd class="txt-color">00:00:25</dd>
						</dl>
					</div>
				</div>

			<!-- 确认完成保洁弹窗 -->
			<div class="sure-clean">
				<span class="mask"></span>
				<div class="sure-content">
					<h2>确定完成保洁?</h2>
					<p>保洁用时：<span class="txt-color">00:00:25</span></p>
					<div class="sure-btn" id="sure-btn">确认</div>
					<span class="close">x</span>
				</div>
			</div>
		</div>
	</body>
</html>
